<template>
    <div class="com-title">
        <h2 v-if="title1">{{ title1 }}</h2>
        <h3 v-if="title2">{{ title2 }}</h3>
        <h4 v-if="title3">{{ title3 }}</h4>
    </div>
</template>

<script setup lang="ts">
defineProps({
    title1: {
        type: String,
    },
    title2: {
        type: String,
    },
    title3: {
        type: String,
    }
})
</script>

<style scoped lang="scss">
.com-title{
    line-height: 36px;
    h2{
        font-size: 16px;
        color: #333;
        line-height: 4px 0;
    }
    h3{
        font-size: 14px;
        color: #666;
        font-weight: 500;
        padding: 0 2px;
    }
    h4{
        font-size: 12px;
        color: #C9CDD4;
        font-weight: 400;
        padding: 0 2px;
    }
}
</style>